<template>
	<section>
		<!--工具条-->
		<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
			<el-form :inline="true" :model="filters">
				<el-form-item>
					<el-input v-model="filters.nick" placeholder="昵称"></el-input>
				</el-form-item>
				<el-form-item>
					<el-input v-model="filters.account" placeholder="手机号"></el-input>
				</el-form-item>
				<el-form-item>
					<el-select v-model="filters.schoolStatus" placeholder="审核状态">
						<el-option label="待审核" value="0"></el-option>
						<el-option label="审核成功" value="1"></el-option>
						<el-option label="审核失败" value="2"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" v-on:click="getUsers">查询</el-button>
				</el-form-item>
			</el-form>
		</el-col>

		<!--列表-->
		<el-table :data="users" highlight-current-row v-loading="listLoading" @selection-change="selsChange" style="width: 100%;">
			<el-table-column type="index" width="60">
			</el-table-column>
            <el-table-column prop="id" label="ID" width="80" >
			</el-table-column>
			<el-table-column prop="nick" label="昵称" width="150" >
			</el-table-column>
			<el-table-column prop="sex" label="性别" width="80" >
			</el-table-column>
			<el-table-column prop="account" label="手机号" width="150" >
			</el-table-column>
			<el-table-column prop="status" label="审核状态" width="100" :formatter="formatStatus" >
			</el-table-column>
			<el-table-column label="操作" min-width="150">
				<template scope="scope">
					<el-button size="small" @click="handleEdit(scope.$index, scope.row)">查看</el-button>
					<el-button type="primary" size="small" @click="goAudit(scope.row.id, '1', scope.$index, scope.row)" v-if="scope.row.schoolStatus == 0">审核通过</el-button>
					<el-button type="danger" size="small" @click="goAudit(scope.row.id, '2', scope.$index, scope.row)" v-if="scope.row.schoolStatus == 0">审核不通过</el-button>
				</template>
			</el-table-column>
		</el-table>

		<!--工具条-->
		<el-col :span="24" class="toolbar">
			<el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="10" :total="total" style="float:right;">
			</el-pagination>
		</el-col>

		<!--查看界面-->
		<el-dialog title="查看" v-model="editFormVisible" :close-on-click-modal="false">
			<el-form :model="editForm" label-width="120px" ref="editForm">
				<el-form-item label="昵称：">
					{{editForm.nick}}
				</el-form-item>
				<el-form-item label="性别：">
					{{editForm.sex}}
				</el-form-item>
				<el-form-item label="手机号：">
					{{editForm.account}}
				</el-form-item>
				<el-form-item label="头像：">
					<img :src="editForm.head" height="100" width="100" style="vertical-align: middle;margin: 5px 0;" />
				</el-form-item>
				<el-form-item label="email：">
					{{editForm.email}}
				</el-form-item>
				<el-form-item label="身份证号：">
					{{editForm.idNo}}
				</el-form-item>
				<el-form-item label="身份证名：">
					{{editForm.idName}}
				</el-form-item>
				<el-form-item label="学校：">
					{{editForm.schoolName}}
				</el-form-item>
				<el-form-item label="学号：">
					{{editForm.schoolNo}}
				</el-form-item>

				<el-form-item label="审核状态：">
					{{detali_status(editForm.schoolStatus)}}
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click.native="editFormVisible = false">关闭</el-button>
			</div>
		</el-dialog>
	</section>
</template>

<script>
    import util from '../../common/js/util'
	//import NProgress from 'nprogress'
    import { getStudentIdentify , studentUpdate } from '../../api/api';
    import moment from 'moment'

	export default {
		data() {
			return {
				filters: {
					schoolStatus: '',
					nick: '',
					account: '',
				},
				users: [],
				total: 0,
				page: 1,
				size: 10,
				listLoading: false,
				sels: [],//列表选中列

				editFormVisible: false,//编辑界面是否显示
				editLoading: false,
				editFormRules: {
					
				},
				//编辑界面数据
				editForm: {
					id: 0,
				}
			}
		},
		methods: {
			detali_status: function (value) {
				if(value == 0){
					return '待审核';
				}else if(value == 1){
					return '审核成功';
				}else if(value == 2){
					return '审核失败';
				}else if(value == -1){
					return '未提交';
				}else{
					return '';
				}
			},
			formatStatus: function (row, column) {
				if(row.schoolStatus == 0){
					return '待审核';
				}else if(row.schoolStatus == 1){
					return '审核成功';
				}else if(row.schoolStatus == 2){
					return '审核失败';
				}else if(row.schoolStatus == -1){
					return '未提交';
				}else{
					return '';
				}
            },
            formatDate: function(row, column){
                return moment(row.create_time).format("YYYY-MM-DD HH:mm:ss")
            },
			handleCurrentChange(val) {
				this.page = val;
				this.getUsers();
			},
			//获取用户列表
			getUsers() {
				let para = {
					page: this.page,
					size: this.size,
					schoolStatus: this.filters.schoolStatus,
					nick: this.filters.nick,
					account: this.filters.account
				};
				this.listLoading = true;
                //NProgress.start();
				getStudentIdentify(para).then((res) => {
                    //console.log("-------------")
                    //console.log(res.data.data)
					this.total = res.data.data.length;

                    this.users = res.data.data;
					this.listLoading = false;
					//NProgress.done();
				});
			},

			//显示查看界面
			handleEdit: function (index, row) {
				this.editFormVisible = true;
				this.editForm = Object.assign({}, row);
			},
			//审核
			goAudit: function (id, num, index, row) {
				var _text = "";
				if(num == 1){
					_text='确认审核通过吗？';
				}else if(num == 2){
					_text='确认审核不通过吗？';
				}else{

				}
				this.$confirm(_text, '提示', {}).then(() => {
					let para = {
						id: id,
						status: num
					};
					studentUpdate(para).then(data=>{
						let {status,desc} = data;
						if(status == 0){
							this.$message({
								message: '提交成功',
								type: 'success'
							});
							this.getUsers();
						}else{
							this.$message({
								message: desc,
								type: 'error'
							});
						}
					});
				});
			},
			selsChange: function (sels) {
				this.sels = sels;
			}
		},
		mounted() {
			this.getUsers();
		}
	}

</script>

<style scoped>

</style>